import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)

const store = new Vuex.Store({
  // 状态属性
  state: {
    count:0,
    num:20,
    size:100,
    msg:'',
    test:'hello,你好',
    score:'还没有哟',
    name:'李冰冰'

  },
  // 状态管理中的计算属性
  getters:{
    getCount(state){
      return state.count+=2;
    },
    isEvenOrOdd(state){
      return state.count%2==0?'偶数':'奇数'
    }
  },
  // 修改state中的值，需改变mutations，改变mutations需用commit
  mutations: {
    add(state,n){
      console.log('增加count');
      state.count+=n;
    },
    addCount(state){
      console.log('增加count,无参数');
      state.count++;
    },
    addSize(state){
      console.log('增加size,无参数');
      state.size+=10;
    },
    reduceCount(state){
      console.log('减少');
      state.count--;
    },
    reduceNum(state){
      console.log('减少');
      state.num-=2;
    },
    changeMsg(state){
      state.msg="我是状态管理"
    }
  },
  // 管理mutations
  actions:{
     a_changeMsg(context){
      setTimeout(()=>{
        console.log('2000秒后修改msg')
        context.commit('changeMsg')
      },2000);
     },
     a_changeScore(context,arr){
       setTimeout(()=>{
        console.log(context.state.score);
        context.state.score = arr;
        console.log(arr)
       });
     },
     a_reduce({commit,state}){
      console.log(commit);
      if(state.num>0){
       commit('reduceNum');
      }
    },
  }
})

export default store;